//flex布局复用
@mixin flex($dir:row, $hov:space-between, $col:center) {
    display: flex;
    flex-direction: $dir;
    justify-content: $hov;
    align-items: $col;
}

@mixin flexcolumn($dir:column, $hov:space-between) {
    display: flex;
    flex-direction: $dir;
    align-content: $hov;
}

@mixin bgImg($w:0, $h:0, $img:'', $size:contain) {
    display: inline-block;
    width: $w;
    height: $h;
    background: url($img) no-repeat center;
    background-size: $size;
}

@mixin position($pos:absolute, $top:0, $left:0, $w:100%, $h:100%) {
    position: $pos;
    top: $top;
    left: $left;
    width: $w;
    height: $h;
}

@mixin positionImg($pos:absolute, $top:0, $right:0, $w:0, $h:0, $img:'') {
    position: $pos;
    top: $top;
    right: $right;
    width: $w;
    height: $h;
    background: url($img) no-repeat center;
    background-size: contain;
}

@mixin wH($w:0, $h:0, $lh:$h) {
    width: $w;
    height: $h;
    line-height: $lh;
}

@mixin fs ($color, $big, $lh, $bold:normal) {
    color: $color;
    font-size: $big;
    line-height: $lh;
    font-weight: $bold;
}

@mixin ellipsis() {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@mixin expand() {
    content: "";
    position: absolute;
    left: -0.1rem;
    top: -0.1rem;
    right: -0.1rem;
    bottom: -0.1rem;
}